<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org" xmlns:layout="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>$Title$</title>


</head>
<body>
    <div th:fragment="sidebar">

        <script type="text/javascript">
            $(document).ready(function () {
                $("ul.left-vertical-nav a").on("click",function (e) {
                    var navId = this.id;
                    var navName = this.text;
                    console.log(navId);
                    var href = $(this).siblings("input[type='hidden']")[0].value;
                    console.log(href);
                    var contentContainer = $("#main-content div.concrete-content-container");
                    contentContainer.load(href,function (response, status, xhr) {
                        console.log("load["+href+"]finished");
                        if ( status == "error" ) {
                            var msg = "Sorry but there was an error: ";
                            contentContainer.html( msg + xhr.status + " " + xhr.statusText );
                        }
                        if(dict.isContain(navId)){
                            $("#nav-history-row li.active").removeClass("active");
                            $("#tab_"+navId).addClass("active");
                            contentContainer.html(dict.get(navId));
                        }else {
                            $("#nav-history-row li.active").removeClass("active");
                            var tabId = "tab_"+navId;
                            $("#nav-history-row ul").append("<li role='presentation' id='"+tabId+"' class='active' ondblclick='doubleClickClose(this)'><a href='#'>" + navName + "</a><input type='hidden' value='" + navId + "'/></li>");
                            dict.put(navId, response);
                        }

                    });
                });
            });
        </script>

        <div>
            <a class="logo" href="/">
                <img src="/images/logo/logo_32.png">
            </a>
        </div>
        <div>
            <ul class="left-vertical-nav">
                <!--<li><a href="#menu">Menu</a> </li>-->
                <!--<li><a href="#category">Category</a> </li>-->
                <li th:each="m : ${nav_list}">
                    <a th:href="${'#'+m.name}" th:text="${m.name}" th:id="${m.id}"></a>
                    <input type="hidden" th:value="${m.url}"/>
                </li>

            </ul>
        </div>
    </div>
</body>

</html>